<script setup lang="ts">
import {reactive, provide} from 'vue';
import {myStore} from '@/store/my'
import WorkExperiencePopup from './WorkExperiencePopup.vue'
import {workDelete} from '@/api/my'
import {Toast} from 'vant';

const store: any = myStore()
const state = reactive({
  show: false,
  item: {}
})
const props = defineProps({
  workEx: {
    type: Object
  }
})
const closeChange = () => {
  state.show = false
  store.getResumeDetail()
}
const editWork = (item: any) => {
  state.item = item
  state.show = true
}
provide('popup', {
  closeChange
})
</script>
<template>
  <div class="resume-label">
    <h3>工作经历
      <van-icon @click="editWork" name="add-o"/>
    </h3>
    <van-swipe-cell v-if="props.workEx">
      <h4>{{ props.workEx.companyName }}
      </h4>
      <h5>{{ props.workEx.jobType }}</h5>
      <p>{{ props.workEx.startTime }} - {{ props.workEx.endTime }}</p>
      <h5>工作描述</h5>
      <van-field
          v-model="props.workEx.workDesc"
          autosize
          readonly
          label=""
          type="textarea"/>
    </van-swipe-cell>
    <label v-else>请您填写工作经历</label>
  </div>
  <!--弹窗-->
  <van-popup v-model:show="state.show" position="top" duration="0" :style="{ width: '100%',height: '100%' }">
    <WorkExperiencePopup :workEx="props.workEx"></WorkExperiencePopup>
  </van-popup>
</template>
<style scoped>
.text-list dt {
  font-size: 0.59rem;
  line-height: 0.59rem;
  font-weight: 300;
  color: #666666;
  padding: 0.4rem 0.5rem;
  margin-right: 0.27rem;
  margin-bottom: 0.3rem;
  background: #F6F7F8;
  border-radius: 0.16rem;
  display: inline-block;
}
</style>